<template>
  <div id="app">
    <h1>根组件</h1>
    <input type="text" v-model.number="num">
    <!-- v-model  -->
    <add-item v-model="num"></add-item>
    <hr>
     <!-- v-model  -->
   <sub-item v-model="num"></sub-item>
  </div>
</template>

<script>
import AddItem from './components/AddItem.vue'
import SubItem from './components/SubItem.vue'

export default {
  name: 'app',
  data:function(){
    return {
      num:1
    }
  },
  components: {
    AddItem,
    SubItem
  },
}
</script>

<style>
#app {
  width: 300px;
  margin: 20px auto;
  border:1px solid #ccc;
  padding:4px;
}
</style>